﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="referrer" content="always">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> <!--兼容手机不缩小-->
    <meta http-equiv="x-dns-prefetch-control" content="on">
    <meta name="description" content="光华智能AGV云平台、致力于自动储运新境界。">
    <meta name="format-detection" content="telephone=no">
    <title>光华智能AGV遥控器</title>
    <link rel="stylesheet" type="text/css" href="Content/Site2.css">
    <link rel="stylesheet" type="text/css" href="Content/Remote2.css">
    <script src="Scripts/jquery-3.4.1.min.js"></script>
    <!--<script src="Scripts/jquery.cookie1.4.1.min.js"></script>-->
    <script src="Scripts/pad.js"></script>
    <script>
        var intervar = setInterval(function () {
            var content = $.trim($('#AGVNum').val());
            if ($.trim(content) == '') {
                $("#prompt").text("请输入AGV编号！");
                $("#prompt").css("color", "red");
            }
            else {
                getStatus(content);
            }
        }, 500);

        var tim0;
        function getStatus(params) {
            $.ajax({
                url: './PadRequest.ashx',
                type: 'post',
                data: {
                    id: 1,
                    name: params
                },
                success: function (res) {
                    try {
                        jsn = $.parseJSON(res);
                        if (jsn.Error == 1) {
                            $('#prompt').text(jsn.str);
                        }
                        else if (jsn.name != params) {
                            $('#prompt').text("下传AGV编号错误！" + jsn.name);
                        }
                        else {
                            $('#prompt').text("");
                            $('#speed').text(jsn.speed);
                            $('#soc').text(jsn.soc);
                            $('#state').text(jsn.state);
                            $('#x').text(jsn.x);
                            $('#y').text(jsn.y);
                            $('#angle').text(jsn.angle);

                            var tim = new Date().getTime();
                            var interval = tim - tim0;
                            tim0 = tim;
                            $('#interval').text(interval);
                        }
                        $('#prompt').text('');
                    } catch (e) {
                        $('#prompt').text('返回数据格式错误！' + res);
                    }
                },
                error: function () {
                    $('#prompt').text('响应错误！');
                },
            });
        }
    </script>
</head>
<body>

    <div class="remote">
        <div>
            <a href="#"><i></i><i></i><span>前进</span></a>
            <a href="#"><i></i><i></i><span>后退</span></a>
        </div>
        <div>
            <a href="#"><i></i><i></i><span>左移</span></a>
            <a href="#"><i></i><i></i><span>右移</span></a>
        </div>
        <div>
            <a href="#"><i></i><i></i><span>左转</span></a>
            <a href="#"><i></i><i></i><span>右转</span></a>
        </div>
        <div>
            <a href="#"><i></i><i></i><span>上升</span></a>
            <a href="#"><i></i><i></i><span>下降</span></a>
        </div>
        <div>
            <a href="#"><i></i><i></i><span>解锁</span></a>
            <a href="#"><i></i><i></i><span>备用</span></a>
        </div>
        <div>
            <a href="#"><i></i><i></i><span>停止</span></a>
            <a href="#"><i></i><i></i><span>启动</span></a>
        </div>
    </div>

    <div class="split2"></div>

    <div class="status">
        <label for="AGVNum">AGV：</label>
        <input type="text" id="AGVNum" title="AGV编号" value="18" />
    </div>
    <div class="status"><div>速度:</div><div id="speed"></div></div>
    <div class="status"><div>电量:</div><div id="soc"></div></div>
    <div class="status"><div>状态:</div><div id="state"></div></div>
    <div class="status"><div>X:</div><div id="x"></div></div>
    <div class="status"><div>Y:</div><div id="y"></div></div>
    <div class="status"><div>角度:</div><div id="angle"></div></div>

    <div class="split"></div>

    <div class="zhouqi"><div>周期：</div><div id="interval"></div><div id="prompt"></div></div>

    <div class="split"></div>

    <div class="foot">佛山市光华智能设备有限公司</div>

    <div class="split2"></div>
</body>
</html>